<template>
  <div class="box">
    <div>人员需求信息</div>
        <p-button type="primary" @click="showAddModal" style="margin-right: 10px">新增</p-button>

      <p-table
        ref="table"
        size="middle"
        bordered
        rowKey="id"
        :columns="defColumns"
        :dataSource="dataSource"
        :pagination="flase"
        :loading="loading"

      >
        <template slot="action" slot-scope="text, record, index">
          <slot name="action" :record="record">
            <p-menu-item>
              <p-popconfirm
                title="确定删除吗?"
                @confirm="() => handleDelete(index)"
              >
                <a>删除</a>
              </p-popconfirm>
            </p-menu-item>
          </slot>
        </template>
      </p-table>

    <PeopleNeedModal ref='peopleNeedModal' @handleSuccess = 'handleSuccess'></PeopleNeedModal>

  </div>
</template>

<script type="text/javascript">
import RenderTable from '@/components/renderTable'
import PeopleNeedModal from './peopleNeedModal.vue'

export default {
  data() {
    return {
      queryParamArr: [

      ],
      defColumns: [
        {
          title: "序号",
          dataIndex: "",
          key: "rowIndex",
          width: 60,
          align: "center",
          customRender: (t, r, index) => {
            return parseInt(index) + 1;
          },
        },
        {
          title: "技能要求描述",
          align: "center",
          dataIndex: "skillExplain",
        },
        {
          title: "需求人数",
          align: "center",
          dataIndex: "needMembers",
        },
        {
          title: "借调开始时间",
          align: "center",
          dataIndex: "lendStartTime",
        },
        {
          title: "借调结束时间",
          align: "center",
          dataIndex: "lendEndTime",
        },
        {
          title: "操作",
          dataIndex: "action",
          align: "center",
          scopedSlots: { customRender: "action" },
        },
      ],
      dataSource: [],
      url: {
        list: '/mes-manpower/mesHrTotalRule/list',
        delete: '/mes-manpower/mesHrTotalRule',
      },
    
      layout: {
        labelCol: { span: 4 },
        wrapperCol: { span: 14 },
      },         
    }
  },
  mounted() {
  },
  methods: {
    handleEdit(record){
      this.$refs.peopleNeedModal.showModal(record)
    },
    // 显示新增弹窗
    showAddModal(){
      this.$refs.peopleNeedModal.showModal()
    },
    handleSuccess(data){
      this.dataSource.push(data)
    },
    handleDelete(index){
      this.dataSource.splice(index, 1)
    },

    clearData(){
      console.log(890);
      
      this.dataSource = []
    },

  },
  components: {
    RenderTable,
    PeopleNeedModal
  }
}
</script>

<style lang="less" scoped>
</style>

